<template>
	<view class="contariner">
		<view class="search">
			<el-input placeholder="请输入课程名称" v-model="keywords" class="input-with-select">
				<el-button slot="append" icon="el-icon-search" @click="getList(1)"></el-button>
			</el-input>
		</view>
		<view class="list" v-if="listData.length > 0">
			<view class="item" v-for="item in listData">
				<view class="left">
					<img v-if="type == 2" src="../../static/images/comment_no.png" alt="">
					<img v-else src="../../static/images/comment.png" alt="">
				</view>
				<view class="center p-l-10 w70">
					<view class="name" v-if="type == 1">{{item.name}}</view>
					<view v-else class="flex justify-between align-item-center">
						<view class="name">{{item.name}}</view>
						<view class="score">{{item.score}}分<image class="award" src="../../static/images/award.png"></image></view>
					</view>
					<view class="grey p-t-5 p-b-5">{{item.semesterName}}</view>
					<view class="grey p-b-5">任课教师：<text style="color: #3B5FD5;">{{item.teacherName}}</text></view>
					<view class="grey">课时：{{item.sectionCount}}</view>
				</view>
				<view class="right">
					<el-button type="primary" class="bg-theme" @click="goDetail(item)">{{type == 1?'评价':'详情'}}</el-button>
				</view>
			</view>
		</view>
		<view v-else class="nodate_allheight">
			<image src="/static/images/wushuju@2x.png" class="nodate_img"></image>
			<view class="nodate_text">暂无数据</view>
		</view>
	</view>
</template>

<script>
	const api = require('@/utils/api.js')
	const util = require("@/utils/util.js")
	export default {
		data() {
			return {
				keywords:null,
				type: null, //1-待评价，2-已评价
				listData: [],
				semesterList:[],
				pageInfo:util.PageEntity()
			}
		},
		onShow() {
			console.log('onShow')
			this.getList(2)
		},
		onLoad(options) {
			this.type = options.type
			if (this.type == 2) {
				uni.setNavigationBarTitle({
					title: '已评价'
				})
			}
		},
		methods: {
			getList(value) {
				this.pageInfo = util.filterSearchParam(this.pageInfo,'state',this.type == 1?'待评价':'已评价','equals','AND')
				this.pageInfo = util.filterSearchParam(this.pageInfo,'name',this.keywords,'contains','AND')
				util.request(api.evolutePage,this.pageInfo).then(res=> {
					if(res.status == 200) {
						this.listData = res.datas.data
					} else {
						util.toast(res.message)
					}
				})
			},
			goDetail(item) {
				uni.navigateTo({
					url:'./detail?id=' + item.id + '&type=' + this.type
				})
			}
		}
	}
</script>

<style>
	.contariner {
		padding-bottom: 10px;
	}
	.search {
		width: 100%;
		padding: 0 20rpx;
		padding-top:20rpx;
	}
	.list {
		margin:20rpx;
		border-radius: 10rpx;
	}
	.list .item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding:20rpx;
		margin-bottom: 30rpx;
		background-color: #fff;
		border-radius: 20rpx;
		border-bottom: 1px solid #f1f1f1;
		box-shadow: #ccc 2px 2px 2px 2px;
	}
	.right {
		padding-left:20rpx;
	}
	img {
		width:100rpx;
		height:100rpx;
	}
	.name {
		color: #3B5FD5;
		font-size: 32rpx;
		font-weight: bold;
	}
	.score {
		min-width:65px;
		font-size: 32rpx;
		font-weight: bold;
		color: #3B5FD5;
	}
	.award {
		width:40rpx;
		height:40rpx;
		margin-left:20rpx;
	}
	.grey {
		color: #858585;
	}
	.right {
		text-align: right;
	}
	/deep/ .right .el-button {
		padding:16rpx 30rpx;
	}
	/deep/ .el-button--primary:focus, /deep/ .el-button--primary:hover,/deep/ .el-button--primary{
		background: #3B5FD5;
		border-color: #3B5FD5;
	}
</style>
